<template>
<!-- 中奖者列表 -->
	<view class="list-box">
		<van-empty v-show="isEmpty" class="custom-image" image="/static/img/empty.png" :description="i18n.user_page.lottery_order.t1">
			<!--您还没有开奖订单,赶快去抽奖吧!-->
			<van-button style="width: 240rpx;" round type="warning" class="bottom-button" @click="goLottery">
				{{i18n.user_page.lottery_order.t2}}
				<!-- 去抽奖 -->
			</van-button>
		</van-empty>
		<view v-for="(item,index) in fightWinRecordList" :key="index" class="cell bg-white my-1 my-no-top br-6">
			
			<view class="item-center d-flex border-bottom" style="border-bottom-color: #f5f5f5;">
				
				<view @click="goToGoodDetail(item)" style="width: 25%;height: auto;max-height: 300upx;" class="item-center-left p-2">
					<image style="width: 160rpx;" mode="widthFix" :src="item.good_header"></image>
				</view>
				
				<view style="width:75%;height:auto;" class="item-center-right d-flex flex-column">
					<!-- 期 -->
					<view @click="goToGoodDetail(item)" class="text-lg text-black text-bold p-1 details-title">
						({{item.good_period}}<text class="f10">{{i18n.common.expect}}</text>)
						{{item.good_name}}
					</view>
					<view class="p-1" style="height: auto;max-height: 300upx;">
						<view>
							<!-- 中奖者 -->
							<text class="text-light-muted f13">{{i18n.user_page.lottert_myWinRecord.t1}}:</text>
							<text class="text-red f13 pl-10">{{nick_name}}</text>
						</view>
						<view>
							<!-- 中奖者号码 -->
							<text class="text-light-muted f13">{{i18n.user_page.lottert_myWinRecord.t2}}:</text>
							<text class="text-red f13 pl-10">{{item.win_num}}</text>
						</view>
						<!-- <view>
							<text class="text-light-muted">最后抽奖时间:</text>
							<text class="text-red">{{dataFormat(new Date(item.create_time))}}</text>
						</view> -->
						<view>
							<!-- 开奖时间 -->
							<text class="text-light-muted f13">{{i18n.user_page.lottery_order.t10}}:</text>
							<text class="text-red f13 pl-10">{{item.lottery_time}}</text>
						</view>
						<view class="d-flex a-center j-sb">
							<view>
								<!-- 抽奖次数 -->
								<text class="text-light-muted f13">{{i18n.user_page.lottery_order.t9}}:</text>
								<text class="text-red f13 pl-10">{{item.count_num}}</text>
							</view>
							<view>
								<!-- 待兑奖 -->
								<button v-if="item.order_status=='待确认'" style="background-color: #fade33;" class="cu-btn round sm text-red f12">
									{{i18n.user_page.lottert_myWinRecord.t3}}
								</button>
								<!-- 待发货 -->
							    <button v-else-if="item.order_status=='待发货'" style="background-color: #a3a3a3;" class="cu-btn round sm text-red f12">
									{{i18n.user_page.t20}}
								</button>
							</view>
						</view>
					</view>
				</view>
			</view>

			<view class="item-bottom">
				<view class="p-1 px-2 d-flex flex-column a-start j-center">
					<!-- <van-button v-if="item.status=='进行中'" @click="itemClick(item)" size="small" class="bg-warning text-white mr-1">追加
					</van-button>
					<van-button size="small" @click="showDrawer(item)" class="bg-warning text-white">我的号码
					</van-button> -->
					<view class="mb" style="word-break: break-all;">
						<!-- 兑奖码 -->
						<!-- <text class="text-light-muted f13">
							{{i18n.user_page.lottert_myWinRecord.t4}}：
							<text selectable="true" class="text-grey">{{item.ticket_number}}</text>
						</text> -->
					</view>
					<view class="d-flex j-end a-center p-1 f13" style="width: 100%;">
						<!-- <view class="px-1">
						 <button class="cu-btn line-red">我的号码</button>
						 </view>
						 <view class="px-1">
						 <button v-if="item.order_status=='待确认'" class="cu-btn  line-red">赠送好友</button>
						 <button v-else disabled="true" class="cu-btn line-gray">赠送好友</button>
						 </view> -->
						 <view class="px-1">
							 <!-- 去兑奖 -->
						 <!-- <button v-if="item.order_status=='待确认'" @click="toExchange()" class="cu-btn  bg-red f12" style="margin-left: 10px;">
							 {{i18n.user_page.lottert_myWinRecord.t5}}
						</button> -->
						<!-- 已兑奖 -->
						 <!-- <button v-else-if="item.order_status=='已发货'&&item.remark==null" disabled="true" class="cu-btn line-gray f12">
							 {{i18n.user_page.lottert_myWinRecord.t6}}
						</button> -->
						<!-- 回收 -->
						 <button v-if="item.order_status=='待确认'" class="cu-btn  bg-red f12" style="margin-left: 10px;" @click="goHuishou(item)">
							 {{i18n.user_page.lottert_myWinRecord.t7}}
						</button>
						<!-- 以回收 -->
						 <!-- <button v-else-if="item.remark=='已寄售'" disabled="true" class="cu-btn line-gray f12">
							 {{i18n.user_page.lottert_myWinRecord.t8}}
						</button> -->
						 </view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	import {
		getFightWinRecordList,
		getAllUserParticipation,
		productShort
	} from '@/api/lottery.js';
	
	import {
		LOGIN_STATUS,
		UID
	} from '@/config/cache';
	import Cache from '@/utils/cache';
	
	import { Dialog } from 'vant';
	
	export default{
		data(){
			return{  ///dfddd
				pageIndex:1,
				fightWinRecordList:[],
				uid:"",
				user_header:'',
				nick_name:'',
				user_ip_address:'',
				loadding: false,
				pullUpOn: true,
				selectedUser:{},
				isEmpty: false,
			}
		},
		onLoad(options){
			this.uid=Cache.get(UID);
			Promise.all([this.getFightWinRecordList()]);
			try {
			this.nick_name=JSON.parse(this.$store.state.app.userInfo).nickname;
			} catch(err) {
            this.nick_name=this.$store.state.app.userInfo.nickname;	
			}
		},
		onShow() {
			try {
			this.nick_name=JSON.parse(this.$store.state.app.userInfo).nickname;
			} catch(err) {
			this.nick_name=this.$store.state.app.userInfo.nickname;	
			}
		},
		computed: {
			i18n() {
				return this.$t('index')
			}
		},
		onReady: function() {
			uni.setNavigationBarTitle({
				title: this.i18n.user_page.t11
			});
		},
		methods:{
			goLottery() {
				uni.switchTab({ url: "/pages/lottery/index/index" })
			},
			getFightWinRecordList(){
				let that=this;
				let data={user_id:this.uid,page:this.pageIndex,limitNum:5}
				let result={};
				getFightWinRecordList(data).then(res=>{
					that.pageIndex=that.pageIndex+1;
					result=res;
					//that.fightRecordList.concat(res);
					if (res.length) {
						for(var i=0;i<res.length;i++){
							that.fightWinRecordList.push(res[i]);
						}	
					} else {
						that.isEmpty = true
					}
					
					if(JSON.stringify(result) == '{}'){
						this.loadding = false;
						this.pullUpOn = false;
					}
					 uni.stopPullDownRefresh();
				});
			},
			goToGoodDetail(item){
				uni.navigateTo({
					url:"/pages/lottery/good_details/good_details?id="+item.id
				});
			},
			showLotteryNum(item){
				this.showDrawer(item);
			},
			dataFormat(time){
				return getApp().dataFormat(time);
			},
			toExchange(){
				uni.navigateTo({
					url:"/pages/lottery/takeTicketCenter/takeTicketCenter"
				})
			},
			goHuishou(item){
				var data={good_fight_id: item.id};
				var that=this;
				
				Dialog.confirm({
				  title: this.i18n.user_page.lottert_myWinRecord.t9, // '商品回收',
				  message: this.i18n.user_page.lottert_myWinRecord.t10 // '确定将商品回收，转化为余额？',
				})
				  .then(() => {
				    productShort(data).then(res=>{
				    	if(res){
				    		that.pageIndex=1;
				    		// that.list = [];
				    		// that.getList();
				    		uni.redirectTo({
				    			url:"/pages/lottery/lottert_myWinRecord/lottert_myWinRecord"
				    		})
				    	}
				    });
				  })
				  .catch(() => {
				    
				  });
			}
		},
		onReachBottom(){
			if (!this.pullUpOn) return;
			this.loadding = true;
			if (this.pageIndex == 5) {
				this.loadding = false;
				this.pullUpOn = false;
			} 
			//else {
			// 	this.newsList = this.newsList.concat(this.loadData);
			// 	this.pageIndex = this.pageIndex + 1;
			// }
			let result=this.getFightWinRecordList();
		},//下拉刷新
		onPullDownRefresh(){
			setTimeout(()=>{
				Promise.all([this.getFightWinRecordList()]);
			},500)	
		}
	}
</script>


<style lang="scss" scoped>
	@import "@/common/font.css";
	// .custom-image .van-empty__image {
	// 	width: 90px;
	// 	height: 90px;
	// }

	// .van-pull-refresh {
	// 	overflow-y: auto;
	// }
	.list-box{
		margin-top: 30upx;
		padding-bottom: 30upx;
	}
	.no-br{
		border: none;
	}

	.my-no-top{
		width: 96%;
		margin: 16upx auto;
	}

	.text-black{
		color: #787878;
	}
	.pl-10{
		padding-left: 10upx;
	}
	.details-title{
		font-size: 14px;
		font-weight: normal;
		color: #000;
	}
	/deep/ .van-empty__image{
		width: 200upx;
		height: 200upx;
	}
	/deep/ .van-button--warning{
		background-color: #e93323;
    	border: 1px solid #e93323;
	}
</style>
